<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>场所检查</title>
    <link rel="stylesheet" href="css/vant.min.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/inspectionDetails.css?v=0.119">
</head>

<body>
    <div id="app" v-cloak>
        <div class="flex-col page">
            <div class="flex-col flex-auto section">
                <div class="flex-col justify-start relative section_2">
                    <div class="flex-row section_3">
                        <div class="flex-col justify-start items-center "
                            :class="indexTab==0?'text-wrapper':'text-wrapper_2'" @click="changeIndexTab(0)">
                            <span :class="indexTab==0?'font_1':'font_2'" class="font_1">检查</span>
                        </div>
                        <div class="flex-col justify-start items-center "
                            :class="indexTab==1?'text-wrapper':'text-wrapper_2'" @click="changeIndexTab(1)">
                            <span :class="indexTab==1?'font_1':'font_2'" v-cloak>检查记录（{{inspectList.length}}）</span>
                        </div>
                    </div>
                </div>
                <!-- 检查 -->
                <div class="flex-col group_2 space-y-60" v-if="indexTab==0" v-cloak
                    style="padding-bottom: 80px;padding-top: 55px;">
                    <ul class="ub-tableUl">
                        <li v-for="(item,index) in list" :key="index"><a :href="'#fire' + index">
                                {{item.name}}
                            </a></li>
                    </ul>
                    <div v-for="(item,index) in list" :key="index" style="position: relative ;">
                        <div :id="'fire' + index"
                            style="position:absolute ;    top: -140px;    width: 10px;    height: 10px;    z-index: -1;">
                        </div>
                        <div class="flex-col" style="margin-top: 0;">
                            <p class="ub-title" v-cloak>{{item.name}}</p>
                            <div class="flex-col section_7 space-y-40" style="margin-bottom: 10px;"
                                v-for="(val,ind) in ans[index]" :key="ind">
                                <div class="flex-col space-y-20">
                                    <div class="flex-col space-y-10">
                                        <div class="flex-row justify-start items-start text-wrapper_3"
                                            style="padding-bottom: 5px;border-bottom: 1px solid #c8c9cc;">
                                            <span class="font_3 text_3" v-cloak>标准{{ind+1}}</span>
                                            <span class="font_3 text_3" v-cloak v-if="val.is_required == 1"
                                                style="color: red;">[必选]</span>
                                            <span class="font_3 text_3" v-cloak v-if="val.is_required == 0"
                                                style="color: red;">[选填]</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="ub-titleBox">
                                    <p>标准要求</p>
                                    <div style="margin-top: 5px;font-weight: bold;" v-cloak>{{val.ques}}</div>
                                </div>
                                <!-- 是否存在风险 -->
                                <div>
                                    <span class="self-start font_6 text_6"><i
                                            v-if="val.is_required == 1">*</i>是否符合标准</span>
                                    <div style="width: 100%;padding: 0 10px;margin-top: 10px;">
                                        <van-radio-group v-model="val.is_standard" direction="horizontal"
                                            @click="rao(event)">
                                            <van-radio name="1">是</van-radio>
                                            <van-radio name="2">否</van-radio>
                                            <van-radio name="3">不涉及</van-radio>
                                        </van-radio-group>
                                    </div>
                                </div>
                                <!-- 隐患 -->
                                <div v-if="val.is_standard==2">
                                    <div class="flex-col equal-division-item space-y-20" v-vloak>
                                        <span class="self-start font_6"><i>*</i>整改时限</span>
                                        <div class="flex-row items-center section_9 space-x-20" style="margin-top: 8px;"
                                            @click="datex(index,ind)">
                                            <img class="image_8" src="images/time.png" />
                                            <span class="font_7"
                                                v-cloak>{{val.deadline==-1?'长期存在':val.deadline +'天'}}</span>
                                        </div>
                                    </div>
                                    <div class="flex-col equal-division-item space-y-19" style="margin-top: 8px;">
                                        <span class="self-start font_6"><i>*</i>情况说明</span>
                                        <div class="section_11">
                                            <div class="flex-col group_6 space-y-107">
                                                <textarea name="" id="" cols="30" rows="10" v-model.trim="val.content"
                                                    class="ub-teret" placeholder="请输入情况说明"></textarea>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="flex-col equal-division-item space-y-26" style="margin-top: 8px;">
                                        <span class="self-start font_6"><i>*</i>照片</span>
                                        <div class="flex-row space-x-20">
                                            <van-uploader :after-read="afterRead" v-model="val.imageslist"
                                                style="width: 100%;" max-count="6" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="flex-row space-x-30 ub-bomBtn">
                        <div class="flex-col justify-start items-center text-wrapper_6">
                            <span class="font_1" @click="goBack()">返回</span>
                        </div>
                        <div class="flex-col justify-start items-center text-wrapper_7" @click="submit()"><span
                                class="font_1">提交</span>
                        </div>
                    </div>
                </div>

                <!-- 检查记录 -->
                <div class="flex-col section_3_1 space-y-175_1" v-if="indexTab==1" v-cloak>
                    <div class="flex-col list_1_1" v-if="inspectList.length != 0">
                        <div class="flex-col group_3_1 list-item_1 space-y-12_1" style="position: relative;"
                            v-for="(item,index) in inspectList" :key="index">
                            <div class="group_4_1" style="display: flex;align-items: center;">
                                <span class="font_1_1" v-cloak style="font-weight: bold;">{{item.place_name}}</span>
                                <img class="image_6_1" src="images/place9xiao.png" v-if="item.is_small_place != 0" />
                            </div>
                            <div class="flex-col">
                                <div class="flex-row items-center space-x-20_1">
                                    <div class="group_5_1">
                                        <span class="font_3_1">检查人员：</span>
                                        <span class="font_4_1" v-cloak>{{item.check_user}}</span>
                                    </div>
                                    <!-- <div class="section_4_1"></div>
                                    <div class="group_5_1">
                                        <span class="font_3_1">隐患条数：</span>
                                        <span class="font_5_1" v-cloak>{{item.trouble_num}}</span>
                                    </div> -->
                                </div>
                                <div class="flex-row justify-between items-end relative group_6_1"
                                    style="margin-top: 8px;">
                                    <div class="group_5_1">
                                        <span class="font_3_1">检查时间：</span>
                                        <span class="font_4_1" v-cloak>{{item.check_time}}</span>
                                    </div>
                                </div>
                                <div class="flex-row justify-between items-end relative group_6_1"
                                    style="margin-top: 8px;">
                                    <div class="group_5_1">
                                        <span class="font_3_1">地址：</span>
                                        <span class="font_4_1" v-cloak>{{item.address}}</span>
                                    </div>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_3_1 ub-btn_re"
                                    @click="goRecord(item.id)">
                                    <span class="font_6_1">查看详情</span>
                                </div>
                                <!-- <div v-cloak v-if="item.content != ''">
                                    <span class="self-start font_3_1 text_3_1">情况说明：</span>
                                    <div class="flex-col justify-start items-start text-wrapper_4_1">
                                        <span class="font_4_1 text_4_1" v-cloak>
                                            {{item.content}}
                                        </span>
                                    </div>
                                </div> -->
                            </div>
                        </div>

                        <div class="flex-col justify-start items-center self-center button_1_1" @click="goBack()">
                            <span class="font_2_1">返回</span>
                        </div>
                    </div>

                    <div v-if="inspectList.length == 0" class="ub-div" v-cloak>
                        <img src="images/noData.png" class="ub-noData_img" alt="">
                        <p class="ub-noData_text">暂无数据</p>
                    </div>
                </div>
            </div>
        </div>

        <van-notify v-model="prompt" type="danger" v-cloak>
            <span>{{promptText}}</span>
        </van-notify>

        <!-- 时间弹窗 -->
        <van-popup v-model="dateShow" position="bottom">
            <van-picker show-toolbar :columns="placeList" value-key="label" @confirm="placeConfirm"
                @cancel="dateShow = false" />
        </van-popup>

        <div class="ub-login_box" v-if="loadShow" v-colak>
            <van-loading size="24px" color="#0094ff" text-color="#0094ff" class="ub-login_po" vertical>加载中...
            </van-loading>
        </div>
    </div>


    <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/vant.min.js"></script>
    <script src="js/jwt-decode.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/cHttp.js?v=1.0.0" type="text/javascript" charset="utf-8"></script>
    <script src="js/jweixin-1.6.0.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/axios.min.js"></script>
    <script src="js/biliFlv.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/wxPublic.js?v=16.0.0" type="text/javascript" charset="utf-8"></script>
    <script>
        var vue = new Vue({
            el: '#app',
            data() {
                return {
                    indexTab: '', //0检查，1检查记录
                    id: '', //场所的id值
                    check_id: '', //检查的id
                    type: '', //检查类型，1普通全部检查，2否的标准进行检查
                    loadShow: false, // 加载
                    inspectList: [], // 检查记录
                    list: {}, // 检查
                    content: '',
                    fileList: [], // 照片
                    fileList2: [], // 照片
                    date: '请选择整改时限', // 时间
                    dateIndex: 0, // 时间对应结果索引
                    dateIndex_1: 0, // 时间对应结果索引
                    dateShow: false, // 时间弹窗
                    prompt: false, // 提示
                    promptText: '', // 提示内容
                    radio3: '', //单选框
                    placeList: [], //时间选择器的数据
                    result: {
                        place_id: '',
                        ans: []
                    },
                    ans: [], //数组结果
                }
            },
            created() {
                this.indexTab = sessionStorage.getItem('numx');
                this.uuid = getRequest().id;
                this.check_id = getRequest().check_id || '';
                this.type = getRequest().type || 1;
                this.getinspect();
                this.getLimit();
                this.getInspectRecords()
            },
            mounted() {

            },
            methods: {
                // 后退
                goBack(val) {
                    history.back()
                },
                rectificationTime(id) {

                },
                // 前往检查详情
                goRecord(id) {
                    sessionStorage.setItem('record', this.uuid);
                    location.href = "./recordDetails.html?id=" + id + '&type=1';

                },
                // 提交检查
                submit() {
                    let arr = JSON.parse(JSON.stringify(this.ans))
                    let data = {
                        place_id: this.uuid,
                        project: []
                    }
                    let flag = false
                    let _flag = true
                    let _flag1 = true //判断是否都是选填
                    for (let i = 0; i < arr.length; i++) {
                        for (let j = 0; j < arr[i].length; j++) {
                            let item = this.ans[i][j]
                            if (item.is_standard.length == 0 && item.is_required == 1) {
                                vant.Toast(this.list[i].name + '  标准' + (j + 1) + '中是否符合标准未选择');
                                flag = true
                                return;
                            }
                            if (item.is_standard == 2) {
                                if (item.deadline == '请选择整改时限') {
                                    vant.Toast(this.list[i].name + ' 标准' + (j + 1) + '中请选择整改时限');
                                    flag = true
                                    return;

                                } else {
                                    if (item.content == '') {
                                        vant.Toast(this.list[i].name + ' 标准' + (j + 1) + '中请填写情况说明');
                                        flag = true
                                        return;

                                    } else {
                                        if (item.imageslist.length == 0) {
                                            vant.Toast(this.list[i].name + ' 标准' + (j + 1) + '中请上传图片');
                                            flag = true
                                            return;
                                        }
                                    }
                                }
                            }

                            if (item.is_standard != '3' && item.is_required == 1) {
                                _flag = false
                            }
                            if (item.is_required == 1) {
                                _flag1 = false
                            }
                            data.project.push(arr[i][j])
                        }
                    }
                    if (_flag && !_flag1) {
                        vant.Toast('检查标准不可全选不涉及。');
                        return;
                    }
                    if (flag)
                        return;
                    data.project.map((item, index) => {
                        item.imageslist.map(i => {
                            item.images.push(i.content)
                        })
                    })
                    for (let i = 0; i < data.project.length; i++) {
                        delete data.project[i].imageslist;
                        delete data.project[i].ques;
                        if (data.project[i].is_standard != 2) {
                            data.project[i].deadline = ''
                            data.project[i].images = []
                            data.project[i].content = ''
                        }
                    }

                    // 发送提交请求
                    ajax({
                        url: formal + '/place-check/save-check',
                        type: "POST",
                        data: data,
                        success: (res) => {
                            this.getInspectRecords()
                            this.getinspect()
                            this.indexTab = 1
                        }
                    })
                },

                afterRead(file) {
                    // 此时可以自行将文件上传至服务器
                    // console.log(file);
                },
                // 切换tab
                changeIndexTab(val) {
                    this.indexTab = val
                },
                // 期限选择弹窗
                placeConfirm(value) {
                    this.dateShow = false;
                    this.$set(this.ans[this.dateIndex][this.dateIndex_1], 'deadline', value.value)
                },
                // 检查
                getinspect() {
                    ajax({
                        url: formal + '/place-check/get-check-project?id=' + this.check_id,
                        type: 'GET',
                        success: (res) => {
                            this.list = res;
                            this.ans = []
                            for (let i = 0; i < this.list.length; i++) {
                                // this.ans.push({
                                //     status: 1,
                                //     name: this.list[i].name
                                // })
                                // this.ans[i] = []
                                this.$set(this.ans, i, [])
                                for (let j = 0; j < this.list[i].list.length; j++) {
                                    let obj = {
                                        project_id: this.list[i].list[j].project_id,
                                        ques: this.list[i].list[j].content,
                                        is_standard: '',
                                        deadline: '请选择整改时限',
                                        content: '',
                                        images: [],
                                        imageslist: [],
                                        is_required: this.list[i].list[j].is_required
                                    }
                                    this.ans[i].push(obj)
                                }
                            }

                        }
                    })
                },
                // 检查记录
                getInspectRecords() {
                    this.loadShow = true;
                    ajax({
                        url: formal + '/place-check/check-list?place_id=' + this.uuid,
                        type: 'GET',
                        success: (res) => {
                            this.inspectList = res;
                            this.loadShow = false;
                        }
                    })
                },
                datex(index, i) {
                    this.dateShow = true;
                    this.dateIndex = index
                    this.dateIndex_1 = i
                },
                rao(event) {
                    console.log(event)
                },
                // 获取检查时限
                getLimit() {
                    ajax({
                        url: formal + '/place-check/get-condition',
                        type: 'GET',
                        success: (res) => {
                            this.placeList = res;
                        }
                    })
                }
            }
        })
    </script>
</body>

</html>